import defaultSettings from '@/settings'
import { initThemeCssVariables, initTheme } from '@/utils/initialization'

const { showSettings, fixedHeader, sidebarLogo } = defaultSettings

const themeList = localStorage.getItem('theme_list_mall') ? JSON.parse(localStorage.getItem('theme_list_mall')) : []
const themeImg = localStorage.getItem('theme_img_mall') ? JSON.parse(localStorage.getItem('theme_img_mall')) : {}

const state = {
  showSettings: showSettings,
  fixedHeader: fixedHeader,
  sidebarLogo: sidebarLogo,
  theme: localStorage.getItem('theme_mall') || '#2F68FD', // 主题颜色
  themeList: themeList,
  themeImg: themeImg
}

const mutations = {
  CHANGE_SETTING: (state, { key, value }) => {
    if (state.hasOwnProperty(key)) {
      state[key] = value
    }
  },
  SET_THEME: (state, theme) => {
    state.theme = theme
  },
  SET_THEME_LIST: (state, themeList) => {
    state.themeList = themeList
  },
  SET_THEME_IMG: (state, themeImg) => {
    state.themeImg = themeImg
  }
}

const actions = {
  changeSetting({ commit }, data) {
    commit('CHANGE_SETTING', data)
  },
  changeTheme({ commit }, theme) {
    commit('SET_THEME', theme)
    localStorage.setItem('theme_mall', theme)
    initTheme(theme)
  },
  changeThemeList({ commit }, themeList) {
    localStorage.setItem('theme_list_mall', JSON.stringify(themeList))
    commit('SET_THEME_LIST', themeList)
    initThemeCssVariables()
  },
  changeThemeImg({ commit }, themeImg) {
    localStorage.setItem('theme_img_mall', JSON.stringify(themeImg))
    commit('SET_THEME_IMG', themeImg)
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}

